<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'header.php'?>
	<style>
		a {
			text-decoration: none;
		}
		a:hover {
			text-decoration: none;
		}
		.img {
			display: flex;
			flex-wrap: wrap;
		}
		.img img{
			width: 210px;
			height: 210px;
			object-fit: cover;
			margin: 15px;
		}
		.form-control {
			height: auto;
		}
		#cboxClose{
			text-indent: 0;
			font-size: 50px;
			font-weight: bold;
			margin-top: 10px;
			color: red;
		}
		.ace-thumbnails li {
			margin: 0 10px;
		}
		#other-format {
			font-size: 16px;
			margin-bottom: 8px;
		}
		.div-file {
			margin: 30px 0;
		}
		.delete-file {
			margin-left: 20px;
		}
    </style>
	<div class="page-header">
		<h1><?=isset($homeworkInfo) ? '编辑班级作业' : '发布班级作业'?></h1>
	</div>

	<div class="col-xs-12">
		<form class="form-horizontal" id="classes-form">
			<input type="hidden" name="id" value="<?=isset($homeworkInfo['id']) ? $homeworkInfo['id'] : 0 ?>" />
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">作业标题：</label>
				<div class="col-sm-6">
					<input class="form-control" type="text" name="homework_title" value="<?= isset($homeworkInfo['homework_title']) ? $homeworkInfo['homework_title'] : '' ?>" placeholder="请填写作业标题"/>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">所属科目：</label>
				<div class="col-sm-6">
					<select class="form-control" name="lesson_id">
						<?php foreach($lessonList as $lesson): ?>
							<option value="<?=$lesson['id']?>"><?=$lesson['lesson_name']?></option>
						<?php endforeach; ?>
					</select>
				</div>
			</div>
			<!-- <div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">学生提交作业：</label>
				<div class="col-sm-6">
					<select class="form-control" name="can_submit">
						<option value="0" <?= isset($homeworkInfo['can_submit']) && $homeworkInfo['can_submit'] ? '' : 'selected' ?>>否</option>
						<option value="1" <?= isset($homeworkInfo['can_submit']) && $homeworkInfo['can_submit'] ? 'selected' : '' ?>>是</option>
					</select>
				</div>
			</div> -->
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">发布班级：</label>
				<div class="col-sm-6">
					<?php foreach($gradeArray as $key => $grade): ?>
						<div class="well well-sm">
							<a class="blue select-grade" href="javascript:;" title="全选年级"><?=$key?> <span style="color: #999;margin-left: 5px">(点击选中全部班级)</span></a>
							<div class="mt5">
							<?php foreach($grade['class'] as $class): ?>
								<label class="inline checkbox-item mr20">
									<input class="ace" type="checkbox" name="homework_class" value="<?=$class['id']?>" />
									<span class="lbl"> <?=$class['class_name']?></span>
								</label>
							<?php endforeach; ?>
							</div>
						</div>
					<?php endforeach; ?>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">作业详情：</label>
				<div class="col-sm-6">
					<textarea class="pd0" id="content" name="homework_content" style="height: 400px;width: 100%"><?= isset($homeworkInfo['homework_content']) ? urldecode($homeworkInfo['homework_content']) : '' ?></textarea>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">上传图片：</label>
				<div class="col-sm-6">
					<div class="form-control">
						<div class="img">
							<ul class="ace-thumbnails clearfix">
								<li>
									<a href="javascript:;" id="upload-img" style="height: 240px;">
										<img class="fit-cover" src="<?=$staticAdminUrl?>assets/images/upload.png" />
									</a>
								</li>
								<?php if(isset($homeworkInfo['imgArr'])): ?>
									<?php foreach($homeworkInfo['imgArr'] as $image): ?>
										<li>
											<a href="<?=$image?>" data-rel="colorbox" class="cboxElement">
												<img class="img-material" src="<?=$image?>" width="150" height="150" class="fit-cover">
												<div class="text">
													<div class="inner"></div>
												</div>
											</a>
											<div class="tools tools-bottom">
												<a href="javascript:;" class="red image-delete">
													<i class="ace-icon fa fa-trash"></i>
												</a>
											</div>
										</li>
									<?php endforeach; ?>
								<?php endif ?>		
							</ul>
						</div>
					</div>
				</div>
			</div>
			<!-- <div class="form-group div-file">
				<label class="col-sm-3 control-label no-padding-right">上传附件：</label>
				<div class="col-sm-6 upload-div">
						<div id="file-outer">
							<?php if(isset($homeworkInfo['fileArr']) && $homeworkInfo['fileArr']): ?>
								<?php foreach($homeworkInfo['fileArr'] as $file): ?>
									<div class="file" data-name="<?= $file['name'] ?>" data-link="<?= $file['link'] ?>">
											<div id="other-format">
												<a href="<?= $file['linkPreview'] ?>" id="check-file-a" target="_blank">
													<i class="ace-icon fa fa-film bigger-110"></i>
													&nbsp;
													<span id="file-name"><?= $file['name'] ?></span>
												</a>
												<i class="delete-file fa fa-trash bigger-110 red"></i>
											</div>
									</div>
								<?php endforeach ?>
							<?php endif; ?>
						</div>
						<div href="javascript:;" id="upload-other-format">
							<img src="<?=$staticAdminUrl?>assets/images/upload.png" />
						</div>
				</div>
			</div> -->
			<div class="clearfix">
				<div class="col-md-offset-3 col-md-9">
					<a class="btn btn-info submit">
						<i class="ace-icon fa fa-check"></i> 提交
					</a>
				</div>
			</div>
		</form>
	</div>
<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'footer.php'?>
<!-- 百度编辑器 -->
<script src="<?=$staticAdminUrl?>assets/ueditor/ueditor.config.js"></script>
<!-- <script src="<?=$staticAdminUrl?>assets/ueditor/ueditor.all.js"></script> -->
<script src="<?=$staticAdminUrl?>assets/ueditor/ueditor.all.js"></script>
<script type="text/javascript">
	$(function(){
		<?php if(isset($homeworkInfo) && !empty($homeworkInfo)): ?>
			// 选中接收的班级
			var classArray = "<?=$homeworkInfo['class_id']?>".split(",");
			for(var i in classArray) {
				var classHomework = $("[name=homework_class][value="+ classArray[i] +"]")[0];
				if(classHomework) {
					classHomework.checked = true;
				}
			}
			// 科目
			$("[name=lesson_id]").val("<?=$homeworkInfo['lesson_id']?>");
		<?php endif; ?>

		// 点击年级，全选下级班级
		var cancel = false;
		$(".select-grade").click(function(){
			// 第一选择，第二次取消选择
			if(cancel) {
				// 取消选择
				$(this).parent().find("[name=homework_class]").each(function(){
					$(this)[0].checked = false;
				});
				cancel = ! cancel;
			} else {
				// 选择
				$(this).parent().find("[name=homework_class]").each(function(){
					$(this)[0].checked = true;
				});
				cancel = ! cancel;
			}
		})

		// 初始化编辑器
		var ue = UE.getEditor('content');
		// // 提交表单
		// var form = $("#classes-form");
		// var submitUrl = "<?=admin_url('contents/save_homework_action')?>";
		// form_submit(form, submitUrl, function(res) {
		// 	tips_alert(res.msg, res.success, function(){
		// 		if(res.success) {
		// 			window.location.href = "<?=admin_url('contents/homework')?>";
		// 		}
		// 	});
		// });
		$(".submit").click(function() {
			var id = $("[name=id]").val();
			var homeworkTitle = $("[name=homework_title]").val();
			var homeworkClassArr = [];
			$("[name=homework_class]").each(function() {
				if($(this).prop("checked")) {
					homeworkClassArr.push($(this).val());
				}
			});
			var homeworkClass = homeworkClassArr.join(',');
			var homeworkContent = $("[name=homework_content]").val();
			var lessonId = $("[name=lesson_id]").val();
			var canSubmit = $("[name=can_submit]").val();
			var imgArr = new Array();
			$(".ace-thumbnails .img-material").each(function() {
				if($(this).css('display') != 'none') {
					imgArr.push($(this).attr("src"));
				}
			});
			// 获取附件
			var fileArr = [];
			// $(".file").each(function() {
			// 	if($(this).css('display') != 'none') {
			// 		var name = $(this).data('name');
			// 		var link = $(this).data('link');
			// 		fileArr.push({
			// 			'name': name,
			// 			'link': link
			// 		});
			// 	}
			// });
			// console.log(fileArr);return;
			var url = "<?=admin_url('contents/save_homework_action')?>";
			var data = {
				"id": id,
				"homework_title": homeworkTitle,
				"homework_class": homeworkClass,
				"homework_content": homeworkContent,
				"lesson_id": lessonId,
				"material": imgArr,
				'file': fileArr,
				'can_submit': canSubmit
			};
			ajax_post(url, data, function() {
				window.location.href = "<?=admin_url('contents/homework')?>";
			});
		});
		// 上传图片对象
		$("#upload-img").uploader({
			"multiple": true, // 多图上传
			"server":  '<?=UP_FORM_URL?>',
			"authorization": "<?=$signature?>",
			"policy": "<?=$policy?>",
			"callback": function(response) {
				var imgFile = "<?=UP_URL?>" + response.url;
				alert(imgFile);
				$(".ace-thumbnails").append('\
					<li>\
						<a href="' + imgFile + '" data-rel="colorbox" class="cboxElement">\
							<img class="img-material" src="' + imgFile + '" width="150" height="150" class="fit-cover">\
							<div class="text">\
								<div class="inner"></div>\
							</div>\
						</a>\
						<div class="tools tools-bottom">\
							<a href="javascript:;" class="red image-delete">\
								<i class="ace-icon fa fa-trash"></i>\
							</a>\
						</div>\
					</li>\
				');
				$('.ace-thumbnails [data-rel="colorbox"]').colorbox(colorbox_params);
			}
		});
		// 图片轮播
		var colorbox_params = {
			rel: 'colorbox',
			reposition:true,
			scalePhotos:true,
			scrolling:false,
			previous:'<i class="ace-icon fa fa-arrow-left"></i>',
			next:'<i class="ace-icon fa fa-arrow-right"></i>',
			close:'&times;',
			current:'',
			maxWidth:'100%',
			maxHeight:'100%',
			onOpen:function(){
				$overflow = document.body.style.overflow;
				document.body.style.overflow = 'hidden';
			},
			onClosed:function(){
				document.body.style.overflow = $overflow;
			},
			onComplete:function(){
				$.colorbox.resize();
			}
		};
		$('.ace-thumbnails [data-rel="colorbox"]').colorbox(colorbox_params);
		// 删除图片
		$("body").on("click", ".image-delete", function(e){
			var that = $(this);
			layer.confirm('确定删除该图片吗？', function(index){
				that.parents("li").find(".img-material").hide();
				layer.close(index);
			});
		});

		var upFromurl = '<?=UP_FORM_URL?>';
		var signature = '<?=$signature?>';
		var policy = '<?=$policy?>';
		// 上传其他格式文件
		$("#upload-other-format").uploader({
			"server": upFromurl,
			"authorization": signature,
			"policy": policy,
			"accept": "all",
			"callback": function(response) {
				// 添加附件
				var fileName = decodeURIComponent(response.name);
				var fileLink = upyunUrl + response.url;
				 // office文件支持预览
				// if(fileLink.search(/^.*\.(doc|docx|ppt|pptx|xls|xlsx)$/) !== -1) {
				// 	fileLinkPreview = "https://view.officeapps.live.com/op/view.aspx?src=" + fileLink;
				// } else {
					fileLinkPreview = fileLink;
				// }
				$("#file-outer").append('\
					<div class="file" data-name="' +  fileName + '" data-link="' + fileLink + '">\
							<div id="other-format">\
								<a href="' + fileLinkPreview + '" id="check-file-a" target="_blank">\
									<i class="ace-icon fa fa-film bigger-110"></i>\
									&nbsp;\
									<span id="file-name">' + fileName + '</span>\
								</a>\
								<i class="delete-file fa fa-trash bigger-110 red"></i>\
							</div>\
					</div>');
			}
		});
		$("body").on("click", ".delete-file", function() {
			var that = $(this);
			var name = that.parents(".file").data('name');
			layer.confirm('确定删除:' + name + '？', function(index){
				that.parents(".file").hide();
				layer.close(index);
			});
		});
	})
</script>